<template>
  <Card :bordered="false" dis-hover>
    <Form>
      <Button type="default" @click="preWeek" class="ivu-mr-16">上一周</Button>
      <Button type="default" @click="nextWeek">下一周</Button>
      <Button
        type="primary"
        class="ivu-fr"
        :loading="loading1"
        v-hasC="{
          name: 'v1-doctor-schedule-edit',
          flag: 'v1/doctor/schedule/edit',
        }"
        @click="handleSchedule"
        >{{ cont }}</Button
      >
    </Form>
    <Table
      class="ivu-mt-16"
      width="100%"
      :columns="columns"
      :data="list"
      :loading="loading"
      border
    >
      <template #basic="{ row }">
        {{ row.name }} <Tag>{{ row.type_str }}</Tag>
      </template>
    </Table>
  </Card>
</template>
<script>
import { planList, editPlanWork } from "@/api/jzy.js";
import dayjs from "dayjs";
export default {
  name: "scheduleList",
  data() {
    return {
      loading: false,
      loading1: false,
      schedule: true,
      cont: "排班",
      columns: [],
      list: [],
      planWork: [],
      nowDate: this.$Date().format("YYYY-MM-DD"),
      planParam: {
        plan_list: [],
      },
    };
  },
  methods: {
    handleSchedule() {
      this.schedule = !this.schedule;
      if (this.schedule === true) {
        if (this.planParam.plan_list.length <= 0) {
          this.cont = "排班";
          return;
        }
        this.loading1 = true;
        editPlanWork(this.planParam).then(
          (res) => {
            this.planParam = {
              plan_list: [],
            };
            this.getData();
            this.cont = "排班";
            this.loading1 = false;
          },
          (rej) => {
            this.planParam = {
              plan_list: [],
            };
            this.loading1 = false;
          }
        );
      } else {
        this.cont = "保存";
      }
    },
    preWeek() {
      let date = new Date(this.nowDate).getTime() - 86400 * 7 * 1000;
      let crrentDate = new Date(date);
      this.nowDate = dayjs(crrentDate).format("YYYY-MM-DD");
      this.getData();
    },
    nextWeek() {
      let date = new Date(this.nowDate).getTime() + 86400 * 7 * 1000;
      let crrentDate = new Date(date);
      this.nowDate = dayjs(crrentDate).format("YYYY-MM-DD");
      this.getData();
    },
    getData() {
      this.loading = true;
      planList({ date: this.nowDate })
        .then((res) => {
          this.planList = res.condition.plan_work;
          this.columns = [
            {
              title: "基本信息",
              slot: "basic",
              width: 158,
              fixed: "left",
            },
          ];
          this.list = [];
          res.list.forEach((item) => {
            this.list.push({
              id: item.id,
              name: item.name,
              type_str: item.type_str,
              ...item.plan_list,
            });
          });
          res.header.forEach((item) => {
            this.columns.push({
              title: item.week + " " + item.date,
              key: item.date,
              align: "center",
              render: (h, params, index) => {
                if (this.schedule) {
                  return params.row[item.date]["plan_work_name"];
                } else {
                  return h(
                    "Select",
                    {
                      value: params.row[item.date]["plan_work_id"],
                      disabled:
                        params.row[item.date]["is_edit"] == 1 ? false : true,
                      onChange: (event) => {
                        this.planParam.plan_list.push({
                          plan_work_id: event.target.value,
                          id: params.row.id,
                          date:
                            new Date(item.time * 1000).getFullYear() +
                            "-" +
                            item.date,
                        });
                      },
                    },
                    this.planList.map((item) => {
                      return h(
                        "Option",
                        {
                          value: item.id,
                          label: item.name,
                        },
                        item.name
                      );
                    })
                  );
                }
              },
            });
          });
        })
        .finally(() => {
          this.loading = false;
        });
    },
  },
  mounted() {
    this.getData();
  },
};
</script>
<style lang="sass" scoped></style>
